<template>
	<view v-if="polygons.length">
		<map show-location style="width: 100%; height:100vh;" latitude="30.569574" scale="12.9" longitude="104.049140" :polygons="polygons">
		</map>
	</view>
</template>

<script setup>
	import {ref,onMounted }from 'vue'
	import { polygonsData } from '@/utils/polygonsData.js'
	import {
		onLoad
	} from "@dcloudio/uni-app";
	const {fillColor,strokeColor,strokeWidth,points} = polygonsData
	let polygonsDataPoints = points.map(val => {
		return {
			latitude: val[1],
			longitude: val[0]
		}
	})
	const polygons = ref([])
	onLoad(()=>{
		polygons.value = [{fillColor,strokeColor,strokeWidth,points:polygonsDataPoints}]
	
	})
</script>

<style>

</style>
